{% extends "explorer/base.html" %}
{% load static %}
{% load i18n %}

{% block head_title %}{% trans "SQL Query List" %}{% endblock head_title %}


{% block sql_explorer_navlinks %}
  {% if can_change %}
    <li><a href="{% url "query_create" %}">{% trans "New Query" %}</a></li>
    <li><a href="{% url "explorer_playground" %}">{% trans "Playground" %}</a></li>
    <li><a href="{% url "explorer_logs" %}">{% trans "Logs" %}</a></li>
  {% endif %}
{% endblock %}

{% block sql_explorer_content %}
  {% if recent_queries|length > 0 %}
    <h3>
      {% blocktrans with recent_queries_length=recent_queries|length %}
      Your {{ recent_queries_length }} Most Recently Run
      {% endblocktrans %}
    </h3>
    <table class="table table-striped">
      <thead>
        <tr>
          <th>{% trans "Query" %}</th>
          <th>{% trans "Last Run" %}</th>
          <th class="text-center">{% trans "CSV" %}</th>
        </tr>
      </thead>
      <tbody>
        {% for object in recent_queries %}
          <tr>
            <td class="name"><a href="{% url "query_detail" object.query_id %}">{{ object.query.title }}</a></td>
            <td>{{ object.run_at|date:"SHORT_DATETIME_FORMAT" }}</td>
            <td class="text-center">
              <a href="{% url "download_query" object.query_id %}"><i class="glyphicon glyphicon-download"></i></a>
            </td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  {% endif %}

  <div id="queries">
    <div class="row">
      <div class="col-md-6">
        <h3>{% trans "All Queries" %}</h3>
      </div>
      <div class="col-md-6 text-right">
        <input class="search list-search" placeholder="Search" style="">
      </div>
    </div>
    <table class="table table-striped">
      <thead>
        <tr>
          <th>{% trans "Query" %}</th>
          <th>{% trans "Created" %}</th>
          {% if tasks_enabled %}
            <th>{% trans "Email" %}</th>
          {% endif %}
            <th>{% trans "CSV" %}</th>
          {% if can_change %}
            <th>{% trans "Play" %}</th>
            <th>{% trans "Delete" %}</th>
          {% endif %}
          <th>{% trans "Run Count" %}</th>
        </tr>
      </thead>
      <tbody class="list">
        {% for object in object_list %}
          <tr {% if object.is_in_category %}class="collapse in collapse-{{ object.collapse_target }}"{% endif %}>
            {% if object.is_header %}
              <td colspan="100">
                <strong>
                  <span data-toggle="collapse" data-target=".collapse-{{object.collapse_target}}" class="toggle">
                    {{ object.title }} ({{ object.count }})
                  </span>
                </strong>
              </td>
              {% else %}
                <td class="name{% if object.is_in_category %} indented{% endif %}">
                  <a href="{% url "query_detail" object.id %}">{{ object.title }}</a>
                </td>
                <td>{{ object.created_at|date:"SHORT_DATE_FORMAT" }}
                  {% if object.created_by_user %}
                    {% blocktrans with created_by_user=object.created_by_user %}
                      by {{ created_by_user }}
                    {% endblocktrans %}
                  {% endif %}
                </td>
                {% if tasks_enabled %}
                  <td>
                    <a class="email-csv" data-id="{{ object.id }}" href="{% url "email_csv_query" object.id %}"><i class="glyphicon glyphicon-envelope"></i></a>
                  </td>
                {% endif %}
                <td>
                  <a href="{% url "download_query" object.id %}"><i class="glyphicon glyphicon-download"></i></a>
                </td>
                {% if can_change %}
                  <td>
                    <a href="{% url "explorer_playground" %}?query_id={{ object.id }}"><i class="glyphicon glyphicon-new-window"></i></a>
                  </td>
                  <td>
                    <a href="{% url "query_delete" object.id %}"><i class="glyphicon glyphicon-trash"></i></a>
                  </td>
                {% endif %}

                <td>{{ object.run_count }}</td>
              {% endif %}
          </tr>
          {% endfor %}
      </tbody>
    </table>
  </div>
{% endblock %}

{% block sql_explorer_scripts %}

    $(function() {
        function SearchFocus() {
            $(".search").focus();
        }
        var options = {
            valueNames: [ 'name' ],
            handlers: { 'updated': [SearchFocus] }
        };
        var queryList = new List('queries', options);
    });

    require(['explorer.queryList'], function(queryList) {
        queryList.QueryList();
    });

{% endblock %}
